<template>
  <view>
    <view class="xinguan-view" v-for="(item, index) in order" :key="index">
      <view class="xinguan-order">
        <text>体检套餐:</text>
        <text>{{ item.phy_name }}</text>
      </view>
      <view class="xinguan-order">
        <text>体检人:</text>
        <text>{{ item.name }}</text>
      </view>
      <view class="xinguan-order">
        <text>体检时间:</text>
        <text>{{ item.phy_time }}</text>
      </view>
      <view class="xinguan-order">
        <text>体检地点:</text>
        <text>{{ item.address }}</text>
      </view>
      <view class="xinguan-order">
        <text>订单编号:</text>
        <text>{{ item.order_number }}</text>
      </view>
      <view class="reg-price"
        ><text>¥{{ item.price }}</text>
      </view>
      <!-- 取消预约 -->
      <view class="reg-cancel">
        <text
          :class="item.cancel ? '' : 'prevent_style'"
          @click="Cancel(item._id, index)"
          >{{ item.cancel ? "取消预约" : "已取消预约" }}
          </text>
      </view>
    </view>
    <!-- 提示组件 -->
    <point :show="show" />
  </view>
</template>

<script setup>
import { ref } from "vue";
import { onShow } from "@dcloudio/uni-app";
import apiRequest from "~/api/index";

let order = ref();
let show = ref(false);
onShow(async () => {
  const res = await apiRequest.PhyuserOrder();
  order.value = res.data;
  if (res.data.length == 0) {
    show.value = true;
  }
});
// 取消预约
async function Cancel(id, index) {
  const res = await apiRequest.RegistCancel({ _id: id });
  if (res.msg == "SUCCESS") {
    order.value[index].cancel = false;
  }
}
</script>

<style lang="scss" scoped>
@import url("../../../common-style/vaccine.css");
</style>
